import GoodsCard from '../../components/GoodsCard'
import {Search} from 'vux'
import {mapState} from 'vuex'
import {Loading} from 'element-ui';

export default {
  name: 'Home',
  data(){
    return {
      loading: false,
    }
  },
  components: {
    GoodsCard, Search
  },
  mounted() {
    const {filter, sort}=this.goods;
    const {pager}=this.goods.data;
    this.loadPageData(filter, pager, sort);
  },
  computed: {
    ...mapState([
      'app',
      'goods'
    ])
  },
  methods: {
    loadPageData(filter, pager, sort){
      this.loadingInstance = Loading.service({text: '加载中...'});
      this.$store.dispatch('HomePageByFilter', {filter, pager, sort}).then(() => {
        this.loading = false
        this.loadingInstance.close();
      }).catch(() => {
        this.loading = false
        this.loadingInstance.close();
      });
    },
    handlerChange(current){
      const {filter, sort}=this.goods;
      const {pager}=this.goods.data;
      this.loadPageData(filter, {...pager, current}, sort);
    },
    handlerChangeSize(pageSize){
      const {filter, sort}=this.goods;
      this.loadPageData(filter, {pageSize, current: 1}, sort);
    }
  }
}
